<template>
	<div class="container">
		<el-dialog
			title="领取物料"
			:visible.sync="showDialog_copy"
			class="main_dialog dialog800"
			@closed="closeOrderDialog"
		>
			<el-form
				:inline="false"
				:model="MaterielInfo"
				class="demo-form-inline"
				ref="craftInfoRef"
				label-width="80px"
				key="userListFrom1"
			>
				<div>
					<div class="main_table table_container" style="min-height: 200px">
						<el-table
							ref="multipleTable"
							v-loading="listLoading"
							:data="MaterielInfo.list"
							element-loading-text="加载中"
							fit
							border
							highlight-current-row
						>
							<el-table-column label="序号" width="60">
								<template slot-scope="scope">
									{{ scope.$index + 1 }}
								</template>
							</el-table-column>
							<el-table-column
								min-width="80"
								show-overflow-tooltip
								label="原料名称"
								prop="name"
							/>
							<el-table-column label="单位" prop="spu_unit" />
							<el-table-column label="总量" prop="num" />
							<el-table-column label="已领取" prop="received_num" />
							<el-table-column
								label="数量"
								min-width="120"
								prop="unreceived_num"
							>
								<template slot-scope="scope">
									<el-input-number
										v-model="scope.row.unreceived_num"
										:controls="false"
										:min="0"
										:precision="2"
										:class="'num_list' + scope.$index"
									></el-input-number>
								</template>
							</el-table-column>
						</el-table>
					</div>
				</div>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button
					type="primary"
					:loading="saveloading"
					@click="preserve(0)"
					v-repeatClick
					>确认领料</el-button
				>
				<el-button @click="showDialog_copy = false">取消</el-button>
			</div>
		</el-dialog>
	</div>
</template>
<script>
	import { process_getList, process_received } from "@/api/sorting/processOrder";

	export default {
		name: "",
		props: {
			showDialog: {
				type: Boolean,
				default: false,
			},
			id: {
				type: Number | String,
				default: "",
			},
		},
		computed: {
			showDialog_copy: {
				get: function () {
					return this.showDialog;
				},
				set: function (newval) {
					this.$emit("update:showDialog", newval);
				},
			},
		},
		data() {
			return {
				listLoading: false,
				saveloading: false,
				// 领取物料
				// showDialog: false,
				MaterielInfo: {
					list: [],
				},
			};
		},
		methods: {
			preserve(is_stock) {
				let arr = [];
				this.saveloading = true;
				this.MaterielInfo.list.map((e) => {
					arr.push({
						id: e.id,
						num: e.unreceived_num,
						goods_name: e.name,
						goods_spu_id: e.spu.id,
						goods_id: e.goods.id,
					});
				});
				let data = {
					is_stock: is_stock,
					id: this.id,
					list: JSON.stringify(arr),
				};
				process_received(data).then((res) => {
					if (res.errcode == 0) {
						this.$message.success("领料成功");
						this.showDialog_copy = false;
						this.$emit("refresh");
					} else if (res.errcode == "40052") {
						this.$confirm(res.errmsg, "提示", {
							confirmButtonText: "确定",
							cancelButtonText: "取消",
							type: "warning",
						})
							.then(() => {
								this.preserve(1);
							})
							.catch(() => {});
					} else {
						this.$message.error(res.errmsg);
					}
					this.saveloading = false;
				});
			},
			closeOrderDialog() {
				this.MaterielInfo.list = [];
				this.listLoading = false;
				this.saveloading = false;
			},
			//获取列表
			process_getList() {
				this.listLoading = true;
				const data = {
					id: this.id,
				};
				let unreceived_num = 0;
				process_getList(data).then((res) => {
					if (res.errcode == 0) {
						res.data.list.map((e) => {
							e.name = `${e.goods.name}【${e.spu.spu_name.title}】`;
							e.spu_unit = `${e.spu.spu_unit.title}`;
							e.unreceived_num = this.$toFixed(
								parseFloat(e.num) - parseFloat(e.received_num)
							);
						});
						this.MaterielInfo.list = res.data.list;
					} else {
						this.$message.error(res.errmsg);
					}
					this.listLoading = false;
				});
			},
		},
	};
</script>
<style lang='scss' scoped>
.add_goods_container {
	display: flex;
	align-items: center;
	padding: 0 0 0 0px;
	li {
		display: flex;
		align-items: center;
		span {
			padding-right: 10px;
			display: block;
			width: 60px;
			text-align: right;
			em {
				padding: 0 5px;
				color: red;
			}
		}
		.width40 {
			width: 60px;
		}
		&:last-child {
			margin-left: 10px;
		}
	}
}
>>> .table_container .el-table--small td .cell {
	height: auto;
}
.icon {
	margin-left: 5px;
	vertical-align: baseline;
}
/deep/ .el-input-number .el-input__inner {
	text-align: left;
}
</style>

